<!DOCTYPE html>
<html>

<head>
  <script src="../node_modules/angular/angular.js"></script>
</head>

<body ng-app="demo">
  <div ng-controller="DemoController">
    <div id="container"></div>
  </div>
  <script>
    angular
      .module('demo', [])
      .controller('DemoController', ['$scope', '$compile', function ($scope, $compile) {
        const myScope = $scope.$new(true)
        myScope.students = [
          { name: '张三', age: 13 },
          { name: '李四', age: 14 },
          { name: '王五', age: 15 },
        ]
        const listStr = [
          '<ul>',
          '<li ng-repeat="item in students">{{ item.name }} {{ item.age }}</li>',
          '</ul>'
        ].join('')
        const list = angular.element(listStr)
        const container = document.getElementById('container')
        angular.element(container).append(list)

        $compile(container)(myScope)
      }]);
  </script>
</body>

</html>